<template>
	<view class="infoData">
		<uni-header :title="'教研活动'"></uni-header>
		<view class="infoContent">
			<view class="info-list">
				<view class="title">姓名</view>
				<view @click="editClick('姓名','userName')" class="text">{{infoData.userName}}</view>
			</view>
			<view class="info-list">
				<view class="title">电话</view>
				<view class="text">{{infoData.mobile}}</view>
			</view>
			<view class="info-list">
				<view class="title">区县</view>
				<view class="text">{{infoData.areaName}}</view>
			</view>
			<view class="info-list">
				<view class="title">学校</view>
				<view class="text">{{infoData.schoolName}}</view>
			</view>
			<view class="info-list">
				<view class="title">学段</view>
				<view @click="editClick('学段','stages')" class="text">{{infoData.stages}}</view>
			</view>
			<view class="info-list">
				<view class="title">学科</view>
				<view @click="editClick('学科','subject')" class="text">{{infoData.subject}}</view>
			</view>
			<view class="info-list">
				<view class="title">密码</view>
				<view class="text"><u-button type="primary" @click="handleForgotPassword">重置密码</u-button></view>
			</view>
			<view class="info-btn"><u-button type="error" @click="logout">退出登录</u-button></view>
		</view>
		<uni-popup ref="inputDialog" type="dialog">
			<uni-popup-dialog ref="inputClose" mode="input" :title="title" :value="value" placeholder="请输入内容"
				@confirm="onsubmit">
				<uni-data-checkbox v-if="file == 'stages'" v-model="periodVal" :localdata="period"></uni-data-checkbox>
				<uni-data-checkbox v-if="file == 'subject'" v-model="subjectVal"
					:localdata="subject"></uni-data-checkbox>
			</uni-popup-dialog>
		</uni-popup>
	</view>
</template>

<script>
	import {
		updateName,
		updatexd,
		updatesubject,
		loginOut
	} from "@/api/mine"

	export default {
		data() {
			return {
				infoData: this.$store.state.user.infoData,
				period: this.$store.state.teach.period,
				subject: this.$store.state.teach.subject,
				file: "",
				title: "",
				value: "",
				periodVal: "",
				subjectVal: "",
			}
		},
		methods: {
			editClick(e, file) {
				this.title = "修改" + e;
				this.file = file;
				this.value = this.infoData[file];
				this.$refs.inputDialog.open()
			},
			onsubmit(e) {
				let deviceId = this.$store.state.user.deviceId;
				if (this.file == "userName") {
					updateName({
						name: e,
						deviceId: deviceId
					}).then(res => {
						this.$store.dispatch('GetInfo')
					})
				} else if (this.file == "stages") {
					updatexd({
						xd: this.periodVal,
						deviceId: deviceId
					}).then(res => {
						this.$store.dispatch('GetInfo')
					})
				} else if (this.file == "subject") {
					updatesubject({
						subject: this.subjectVal,
						deviceId: deviceId
					}).then(res => {
						this.$store.dispatch('GetInfo')
					})
				}
			},
			handleForgotPassword() {
				this.$tab.reLaunch('/pages/forgotPassword')
			},
			logout() {
				loginOut().then(res => {
					if (res.status == 0) {
						uni.$u.toast('退出成功');
						setTimeout(() => {
							this.$tab.reLaunch('/pages/login')
						}, 2000);
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff;

		.infoContent {
			.info-list {
				display: flex;
				justify-content: space-between;
				align-items: center;
				padding: 15px 10px;
				border-bottom: 1px solid #eee;

				.title {
					font-size: 18px;
					color: #3b4144;
				}

				.text {
					font-size: 14px;
					color: #999;
				}
			}

			.info-btn {
				margin: 10px;
			}
		}
	}
</style>